@use '../modules' as *;
@forward '../common';
@forward 'buttons';

.app-notification,
.app-notification.frame {
  @extend %osd;

  padding: 10px;
  border-radius: 0 0 calc($button_radius + 6px) calc($button_radius + 6px);
  background-color: $osd_bg_color;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.2), transparent 2px);
  background-clip: padding-box;
  border: none;

  &:backdrop {
    background-image: none;
    transition: $backdrop_transition;
  }

  button { @extend %osd_button; }

  border { border: none; }
}
